<html>
<head>
<#assign basePath=request.contextPath>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>后台管理系统</title>
<#include "/WEB-INF/views/template/bootMainCss.ftl" parse=true encoding="utf-8">
    <link href="${basePath}/bootstrap/plugin/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">
    <link href="${basePath}/bootstrap/css/form.lzy.css" rel="stylesheet">
    <style>
        .row{ margin: 0;}
        .cash-info-tip{margin-right: 10px;}
        .search{ float: left;}
        .shop-img{ text-align: left; padding-left: 30px;}
        .shop-img img{ float: left; margin-right: 10px;}
        .shop-img span{ display: block;}
        .name{ text-align: left; padding-left: 30px;}
        .name span{ display: block;}
        #tbodyId{ font-size: 13px;}
        #myTable thead{ font-size: 14px;}
        #startTime form-control{width: 100%;}
        .form_datetime{ float: left; width: 240px; margin-left: 70px;}
        #myForm .form-inline{float: right;}
        span .projectName{margin-right:0;}
        .data-search{margin-right: 20px;}
    </style>
</head>
<body>
<input type="hidden" id="pack_page" value="1">
<div class="panel panel-lzy">
    <div class="panel-body">
        <h5 class="tips-lzy">操作提示</h5>
        <ul class="tips-list-lzy">
            <li>◆&nbsp;<span>该页面显示了该业务员每天的相关统计。</span></li>
        </ul>
    </div>
</div>
<!--支付信息-->
<div class="panel-body row">
    <div class="cash-info-tip">
        <span>总计生产<span class="projectName">${projectName!}</span>:<b id="totalCount"><#if totalProject??>${totalProject?c}<#else>0</#if></b></span>
    </div>
    <div class="cash-info-tip">
        <span>查询产生<span class="projectName">${projectName!}</span>:<b id="queryCount">0</b></span>
    </div>
</div>

<div class="panel-body row">
    <form id="myForm" class="form-margin-right">
        <button type="button" class="btn btn-primary search" onclick="exportProjectRecord();">导出数据</button>
        <div id="start_visit_time" class="input-group date form_datetime">
            <span class="input-group-addon">开始日期</span>
            <input id="startDate" name="startDate" class="form-control" size="16" type="text" value="" readonly>
            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
        </div>
        <div id="end_visit_time" class="input-group date form_datetime">
            <span class="input-group-addon">结束日期</span>
            <input id="endDate" name="endDate" class="form-control" size="16" type="text" value="" readonly>
            <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
        </div>
        <div class="form-group form-inline">
            <span>类型：</span>
            <select class="form-control required" name="projectType" id="projectType">
            <#list projectTypeList as projectType>
                <option value="${projectType.code?c}"
                    <#if projectType.code == projectType>selected</#if>
                >${projectType.desc}</option>
            </#list>
            </select>
            <input type="text" class="form-control" id="skuName" placeholder="输入产品名称查询">
            <button type="button" class="btn btn-primary btn-sm" onclick="search(1)">查询</button>
        </div>
    </form>
</div>
<div class="panel-body row">

    <!-- 分页查询的地址-->
    <div class="panel-body panel-white">
        <div class="table-responsive">
            <table id="myTable"
                   class="table table-hover"
                   data-url="${basePath}/admin/statistics/projectRecord/json"
                   data-pageSize="10,50,100" data-method="GET">
                <thead>
                <!-- 需要循环的字段  对应mapper文件-->
                <tr>
                    <#--<th  data-type="checkbox" data-field="id"></th>-->
                    <th  data-type="xuhao" width="8%">编号</th>
                    <th  data-field="orderId">订单号</th>
                    <th  data-field="skuName" width="30%">产品名称</th>
                    <th  data-field="count" width="15%">产生<span class="projectName">${projectName!}</span></th>
                    <th  data-field="orderTime" width ="20%">成交时间</th>
                </tr>
                </thead>
                <tbody id="tbodyId">

                </tbody>
            </table>
        </div>
        <!-- 分页条-->
        <div class="row">
            <div align="left" class="col-xs-6">
                <div class="input-group">
                    <span class="input-group-addon" id="pageCount"></span> <select
                        id="pageSize" onchange="search(1)" class="form-control"
                        style="width: 100px"></select>
                </div>
            </div>
            <div align="right" class="col-xs-6">
                <ul class="pagination" id="pagination"></ul>
            </div>
        </div>
    </div>

</div>
<#include "/WEB-INF/views/template/bootMainJs.ftl" parse=true encoding="utf-8">
<script type="text/javascript" src="${basePath}/bootstrap/js/utils.js" type="text/javascript"></script>
<script type="text/javascript" src="${basePath}/bootstrap/plugin/jqPaginator/jqPaginator.js"></script>
<script type="text/javascript" src="${basePath}/bootstrap/plugin/jqPaginator/myPage.js"></script>
<script type="text/javascript" src="${basePath}/bootstrap/plugin/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="${basePath}/bootstrap/plugin/bootstrap-datetimepicker/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript">

    //结束日期大于开始日期
    $(function() {
        $("#depart-box label input").each(function () {
            if (idArr.indexOf(parseInt($(this).val())) != "-1") {
                $(this).prop("checked", true)
            }
        })

        $('#start_visit_time').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            format: "yyyy-mm-dd", //选择日期后，文本框显示的日期格式
            language: 'zh-CN', //汉化
//            startDate: new Date(),
            autoclose: true //选择日期后自动关闭
        }).on("changeDate", function () {
            $("#end_visit_time").datetimepicker("setStartDate", $("#startDate").val());
        });
        $('#end_visit_time').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            format: "yyyy-mm-dd", //选择日期后，文本框显示的日期格式
            language: 'zh-CN', //汉化
//            startDate: new Date(),
            autoclose: true //选择日期后自动关闭
        });

    })
    function tableCallBack(data, id) {
        if (id == 'button') {//增加操作按钮
        }
        else {
            if(data[id] == null || data[id] == ''){
                return '';
            }else{
                return data[id];
            }
        }
    }

    //导出
    function exportProjectRecord(){
        layer.confirm('是否确定此操作？', {
            btn: ['确定','取消'] //按钮
        }, function() {
            var projectType = $("#projectType").val();
            var startDate = $("#startDate").val();
            var endDate = $("#endDate").val();
            window.location.href='${basePath}/admin/statistics/exportProjectRecord?projectType='+projectType+"&startDate="+startDate+"&endDate"+endDate;
        });
    }

    function packValue(data) {
        var queryCount = data.queryCount;
        var projectName = data.projectName;
        var totalCount = data.totalCount;
        if(queryCount != null) {
            $("#queryCount").text(queryCount);
        } else{
            $("#queryCount").text(0);
        }
        if(totalCount != null) {
            $("#totalCount").text(totalCount);
        } else{
            $("#totalCount").text(0);
        }
        $(".projectName").text(projectName);
    }

</script>
</body>
</html>